<!-- 用户 》 工作 -->

<template>
  <div>
    <EasyDivider text="工作信息" />

    <EasyRow col3>
      <!-- 既保存部门 ID，也保存部门名称 -->
      <FormTree label="所属部门" bind="organId, organName" :dict="organ_treeDict" :grayed="grayed" allName required />
      <FormTreeMulti
        label="多部门"
        bind="organsIdList, organsNameList"
        :dict="organ_treeDict"
        :grayed="grayed"
        word3
        third2
      />
    </EasyRow>

    <EasyRow>
      <FormDateRange label="合同期限" bind="beginDate, endDate" eighth3 required />
      <FormSlot noLabel eighth3>
        <FormDate label="起始日期" bind="beginDate" :disabled="!one.beginDate" history noLabel half required />
        <FormDate label="截止日期" bind="endDate" :disabled="!one.endDate" future noLabel half required />
      </FormSlot>
      <FormInput label="年薪" bind="salary" word2 quar required />
    </EasyRow>

    <EasyRow>
      <FormLink label="个人主页" bind="link" eighth3 required />
      <FormEmail label="联系邮箱" bind="email" :reg="/@qq\.com$/" regErr="仅支持 QQ 邮箱" eighth3 required />
      <FormCarNo label="车牌" bind="vehicle" word2 quar required />
    </EasyRow>

    <FormRichText label="个性签名" bind="selfSign" folder="demo" :height="200" :disabled="isShow" required />
  </div>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import UTIL from './UTIL'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'UserWork',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixWeb(), CORE.mixTree('organ', 'organ_')],

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: {
    /**
     * 置灰列表
     */
    grayed() {
      const grayed = []
      UTIL.setGrayed(grayed, this.organ_tree)
      return grayed
    },
  },
}
</script>
